<extend name="Public:main" />
<block name="custom_css">
    <style type="text/css">
        .ex_t{
            margin: 0;
            background: #1098EF;
        }
        /*.ex_t div label{
            color: black;
        }*/
        /*.ex_t div p{
            color: #fff;
        }*/
        .masks-remark {
            width: 3rem;
            height: 1.76rem;
            background: #fff;
            padding-left: 0.01rem;
             position: relative!important;
             border: none !important;
            text-align: center;
            border-radius: 3px 3px 0px 0px;
            top: 0;
            padding: 0.12rem;
             margin-left: 0;
             left: 0;
            display: none;
            z-index: 111;
        }
        .pwd-box-remark {
            width: 3rem!important;
            background: #fff;
            padding-left: 0.01rem;
            position: relative!important;
            border: none !important;
            border-radius: 0px 0px 3px 3px;
            overflow: hidden;
            top: 0;
            padding: 0.12rem;
             margin-left:0;
             left: 0;
            display: none;
            z-index: 111;
        }
    </style>
</block>
<block name="title">xpay</block>
<block name="body">
    <body ng-app="myApp" ng-controller="Ctrl" ng-cloak>
        <input type="hidden" id="type" value="{$type}">
        <input type="hidden" id="currency" value="{$currency}">
        <input type="hidden" id="trans_type" value="{$trans_type}">
        <div class="nav_top flex">
            <a  href="{:U('Virtualcurrency/digital_assets')}">
                <i></i>
            </a>
            <div class="flex1">
                <select ng-change="getAll()" ng-model="currency" ng-value="{{res.currency}}">
                    <volist name="currencylist" id="vo">
                        <option value="{$vo.id}">{$vo.china_name}</option>
                    </volist>
                </select>
            </div>
            <a  href="javascript:void(0)">

            </a>
        </div>
        <div style="height: 0.44rem;"></div>
        <div class="flex ex_t">
            <div class="flex1">
                <label>{{res.payvir}}</label>
                <p>{{res.payname}}资产</p>
            </div>
            <div></div>
            <div class="flex1">
                <label>{{res.balance}}</label>
                <p>余额</p>
            </div>
        </div>
        <div class="xpay_tp">
            <ul>
                <li>
                    <label>
                        当前价格
                    </label>
                    <span>
                        {{res.curprice}}
                    </span>
                </li>
                <li>
                    <label>
                        高
                    </label>
                    <span ng-if="res.maxprice=='' || res.maxprice==null">
                        {{res.curprice}}
                        <i class="rise"></i>
                    </span>
                    <span ng-if="res.maxprice!='' && res.maxprice!=null">
                        {{res.maxprice}}
                        <i class="rise"></i>
                    </span>
                </li>
                <li>
                    <label>
                        低
                    </label>
                    <span ng-if="res.minprice=='' || res.minprice==null">
                        {{res.curprice}}
                        <i class="fall"></i>
                    </span>
                    <span ng-if="res.minprice!='' && res.minprice!=null">
                        {{res.minprice}}
                        <i class="fall"></i>
                    </span>
                </li>
            </ul>
        </div>
        <div class="xpay_nav">
            <ul>
                <li style="width: 33.3%">
                    <a id="sellorder" href="/index.php/Home/Virtualcurrency/sell_order?type={$type}&currency={$currency}&trans_type=2">
                        <i></i>
                        <div>
                            发布出售订单
                        </div>
                    </a>
                </li>
                <li style="width: 33.3%">
                    <a id="buyorder" href="/index.php/Home/Virtualcurrency/purchase_order?type={$type}&currency={$currency}&trans_type=1">
                        <i></i>
                        <div>
                            发布购买订单
                        </div>
                    </a>
                </li>
                <li style="width:33.3%">
                    <a href="/index.php/Home/Virtualcurrency/xpay_orderlist?type={$type}&currency={$currency}&trans_type={$trans_type}&status=1"><!--默认未完成-->
                        <i></i>
                        <div>
                            订单
                        </div>
                    </a>
                </li>
                <!--<li>
                    <a href="javascript:void(0)">
                        <i></i>
                        <div>
                            交易记录
                        </div>
                    </a>
                </li>-->
            </ul>
        </div>
        <div class="mt10">
            <div class="xpay_m">
                <ul>
                    <li class="active8" style="width: 50%;" ng-click="transType(2)">
                        购买
                    </li>
                    <li style="width: 50%;" ng-click="transType(1)">
                        出售
                    </li>
                </ul>
            </div>
            <div class="pay_list">
                <ul>
                    <li class="flex" ng-repeat="log in logs">
                        <!--<div>-->
                            <!--<img ng-src="{{log.bprofilePhoto}}" ng-if="log.trans_type == 1">-->
                            <!--<img ng-src="{{log.sprofilePhoto}}" ng-if="log.trans_type == 2">-->
                        <!--</div>-->
                        <!--<div ng-if="(log.bprofilePhoto=='' && log.trans_type == 1) || (log.sprofilePhoto=='' && log.trans_type == 2)">-->
                            <!--<img ng-src="__PUBLIC__/vpay/images/shezhi_icon_head.png">-->
                        <!--</div>-->
                        <div ng-if="log.trans_type == 1 && log.bprofilephoto !='' && log.bprofilephoto !=null">
                            <img ng-src="{{log.bprofilephoto}}" style="height: 100%;border-radius: 50%">
                        </div>
                        <div ng-if="log.trans_type == 1 && (log.bprofilephoto ==''  || log.bprofilephoto ==null)">
                            <img ng-src="__PUBLIC__/vpay/images/shezhi_icon_head.png">
                        </div>
                        <div ng-if="log.trans_type == 2 && log.sprofilephoto !='' && log.sprofilephoto !=null">
                            <img ng-src="{{log.sprofilephoto}}" style="height: 100%;border-radius: 50%">
                        </div>
                        <div ng-if="log.trans_type == 2 && (log.sprofilephoto ==''  || log.sprofilephoto ==null)">
                            <img ng-src="__PUBLIC__/vpay/images/shezhi_icon_head.png">
                        </div>

                        <div class="flex1">
                            <label ng-if="log.trans_type == 1">
                                {{log.bname}}
                            </label>
                            <label ng-if="log.trans_type == 2">
                                {{log.sname}}
                            </label>
                            <p>
                                限额：{{log.entrustnum}}
                            </p>
                        </div>
                        <div ng-if="log.trans_type == 1">
                            <label>{{log.price}}</label>
                            <button ng-click="btn_sell(log.id,log.bname,log.entrustnum,log.price);">
                                卖出
                            </button>
                        </div>
                        <div ng-if="log.trans_type == 2">
                            <label>{{log.price}}</label>
                            <button ng-click="btn_buy(log.id,log.sname,log.entrustnum,log.price);">
                                购买
                            </button>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <div class="masks">
        </div>
       <div style="    position: absolute;
    width: 3.24rem;
    top: 15%;
    z-index: 100;
    left: 50%;
    margin-left: -1.62rem;">
           <div class="masks-remark">
               <div style="color:red;line-height: 0.3rem;" id="titleDiv">

               </div>
               <div style="text-align: left;line-height: 0.3rem;">
                   <label style="color: #6b7d86;">限额：</label>
                   <span id="num"></span>
                   <hr style="background-color:red;height: 1px;border: none;"/>
               </div>
               <div style="text-align: left;line-height: 0.3rem;">
                   <label style="color: #6b7d86;">当前价格：</label>
                   <span id="price"></span>
                   <hr style="background-color:red;height: 1px;border: none;">
               </div>
               <div style="text-align: left;line-height: 0.3rem;height: 0.3rem;">
                   <label id="cur" style="color: #6b7d86;"></label>
                   <span><input type="text" value="" id="changeNum" style="border: none" oninput="changeMoney(this.value);"/></span>
                   <hr style="background-color:red;height: 1px;border: none;">
               </div>
               <div style="text-align: left;line-height: 0.3rem;height: 0.3rem;">
                   <label style="color: #6b7d86;">余额：</label>
                   <span id="money"></span>
                   <hr style="background-color:red;height: 1px;border: none;">
               </div>
           </div>
           <div class="pwd-box-remark" style="text-align: center">
               <input type="hidden" class="" id="id-input" style="">
               <input type="tel" maxlength="6" class="pwd-input" id="pwd-input">
               <div class="fake-box" style="text-align: center;">
                   <input type="password" readonly="">
                   <input type="password" readonly="">
                   <input type="password" readonly="">
                   <input type="password" readonly="">
                   <input type="password" readonly="">
                   <input type="password" readonly="">
               </div>

               <div style="text-align: center;">
                   输入支付密码
               </div>
           </div>
       </div>
    </body>
    <block name="custom_js">
        <script src="http://zeptojs.com/zepto.min.js"></script>
        <script>
            var app = getApp('myApp', []);
            app.controller('Ctrl', function ($scope, $http) {
                // 当前页数
                $scope.p = 0;
                // 加载完毕标志
                $scope.endflg = 0;
                // 防止重复加载
                $scope.busy = false;
                // 存放列表数据
                $scope.logs = [];
                //存放所有数据
                $scope.res = "";
                // 请求数据方法
                $scope.loadMore = function(){
                    //交易类型
                    $scope.type = $("#type").val();
                    //交易类型
                    $scope.currency = $("#currency").val();
                    //交易类型
                    $scope.trans_type = $("#trans_type").val();

                    if($scope.endflg == 0){
                        if($scope.busy){
                            return false;
                        }
                        $scope.busy = true;
                        $http({
                            method:'POST',
                            data:{
                                "p" : $scope.p,
                                "type" : $scope.type,
                                "currency" : $scope.currency,
                                "trans_type" : $scope.trans_type
                            },
                            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                            transformRequest: function(obj) {
                                var str = [];
                                for (var p in obj) {
                                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
                                }
                                return str.join("&");
                            },
                            url: "/index.php/Home/Virtualcurrency/xpay?p="+$scope.p,
                        }).then(function successCallback(response) {
                            $scope.busy = false;
                            if(response.data.data != '' && response.data.data != null){
                                if($scope.p > 0) {
                                    layer.msg("正在加载...", {time: 500});
                                }
                            } else {
                                layer.msg("已经全部加载完了...", {time:500});
                                $scope.endflg = 1;
                                return false;
                            }
                            $scope.p++;
                            if(response.data.code == -1){
                                layer.msg(response.data.msg,{time:1500})
                            }else{
                                if(response.data.data == null){
                                    layer.msg(response.data.msg,{time:1500});
                                } else {
                                    $scope.res=response.data.data;
                                    // 组织数据
                                    for (var i in response.data.data.list) {
                                        $scope.logs.push(response.data.data.list[i]);
                                    }
                                }
                            }
                        }, function errorCallback(response) {
                            errorHandle(response);
                        });
                    }else{
                        layer.msg("已经全部加载完了...", {time:500});
                    }
                };
                // 进页面先加载一次数据
                $scope.loadMore();

                $(window).scroll(function(){
                    var scrollTop = $(this).scrollTop();
                    var scrollHeight = $(document).height();
                    var windowHeight = $(this).height();
                    if(scrollTop + windowHeight == scrollHeight){
                        $scope.loadMore();
                    }
                });
                //币种改变
                $scope.getAll=function () {
                    //更改input
                    $("#currency").val($scope.currency);
                    //更改发布出售订单
                    $("#sellorder").attr("href","/index.php/Home/Virtualcurrency/sell_order?type="+$("#type").val()+"&currency="+$scope.currency+"&trans_type=2");
                    //更改发布购买订单
                    $("#buyorder").attr("href","/index.php/Home/Virtualcurrency/purchase_order?type="+$("#type").val()+"&currency="+$scope.currency+"&trans_type=1");

                    //订单

                    //交易记录

                    $scope.p=0;
                    // 加载完毕标志
                    $scope.endflg = 0;
                    // 防止重复加载
                    $scope.busy = false;
                    // 存放列表数据
                    $scope.logs = [];
                    //存放所有数据
                    $scope.res = "";
                    $scope.loadMore();
                }
                //流通类型
                $scope.transType=function (obj) {
                    $("#trans_type").val(obj);
                    $scope.p=0;
                    // 加载完毕标志
                    $scope.endflg = 0;
                    // 防止重复加载
                    $scope.busy = false;
                    // 存放列表数据
                    $scope.logs = [];
                    //交易类型
                    $scope.type = $("#type").val();
                    //交易类型
                    $scope.currency = $("#currency").val();
                    //交易类型
                    $scope.trans_type = $("#trans_type").val();

                    if($scope.endflg == 0){
                        if($scope.busy){
                            return false;
                        }
                        $scope.busy = true;
                        $http({
                            method:'POST',
                            data:{
                                "p" : $scope.p,
                                "type" : $scope.type,
                                "currency" : $scope.currency,
                                "trans_type" : $scope.trans_type
                            },
                            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                            transformRequest: function(obj) {
                                var str = [];
                                for (var p in obj) {
                                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
                                }
                                return str.join("&");
                            },
                            url: "/index.php/Home/Virtualcurrency/getTransData?p="+$scope.p,
                        }).then(function successCallback(response) {
                            $scope.busy = false;
                            if(response.data.data != '' && response.data.data != null){
                                if($scope.p > 0) {
                                    layer.msg("正在加载...", {time: 500});
                                }
                            } else {
                                layer.msg("已经全部加载完了...", {time:500});
                                $scope.endflg = 1;
                                return false;
                            }
                            $scope.p++;
                            if(response.data.code == -1){
                                layer.msg(response.data.msg,{time:1500})
                            }else{
                                if(response.data.data == null){
                                    layer.msg(response.data.msg,{time:1500});
                                } else {
                                    // 组织数据
                                    for (var i in response.data.data) {
                                        $scope.logs.push(response.data.data[i]);
                                    }
                                }
                                console.log($scope.logs);
                            }
                        }, function errorCallback(response) {
                            errorHandle(response);
                        });
                    }else{
                        layer.msg("已经全部加载完了...", {time:500});
                    }
                }

                //卖出
                $scope.btn_sell=function (id,bname,entrustnum,price) {
                    $scope.transId=id;
                    $("#titleDiv").text("向【"+bname+"】卖出"+$scope.res.payname);
                    $("#num").text(entrustnum);
                    $("#price").text(price);
                    $("#money").text("");
                    $("#changeNum").val("");

                    $("#cur").text($scope.res.payname+":");
                    $('.masks,.masks-remark,.pwd-box-remark').show();
                    /*$(".masks").click(function(){
                        $('.masks,.masks-remark,.pwd-box-remark').hide();
                    });*/
                }

                //购买
                $scope.btn_buy=function (id,sname,entrustnum,price) {
                    $scope.transId=id;
                    $("#titleDiv").text("向【"+sname+"】购买"+$scope.res.payname);
                    $("#num").text(entrustnum);
                    $("#price").text(price);
                    $("#money").text("");
                    $("#changeNum").val("");
                    $("#cur").text($scope.res.payname+":");
                    $('.masks,.masks-remark,.pwd-box-remark').show();
                }

                $(".pwd-input").on("input", function() {
                    var $input = $(".fake-box input");
                    var pwd = $(this).val().trim();
                    for (var i = 0, len = pwd.length; i < len; i++) {
                        $input.eq("" + i + "").val(pwd[i]);
                    }
                    $input.each(function() {
                        var index = $(this).index();
                        if (index >= len) {
                            $(this).val("");
                        }
                    });
                    if (len == 6) {
                        //执行其他操作
                        var num = '';
                        $input.each(function() {
                            num += $(this).val().trim()
                        });

                        var id = $("#id-input").val();
                        if (num.length != 6) {
                            layer.msg("请输入您6位数字支付密码！");
                            return;
                        }
                        if (id == 'undefined' || id == undefined || id == 'null' || id == null) {
                            layer.msg("请刷新页面重试！");
                            return;
                        }

                        //发送post请求
                        $http({
                            method:'POST',
                            data:{
                                "pwd" : num,
                                "id" : $scope.transId,
                                "changeNum":$("#changeNum").val(),
                                "type":$("#type").val(),
                                "currency":$("#currency").val(),
                                "trans_type":$("#trans_type").val()
                            },
                            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                            transformRequest: function(obj) {
                                var str = [];
                                for (var p in obj) {
                                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
                                }
                                return str.join("&");
                            },
                            url: "/index.php/Home/Virtualcurrency/trade"
                        }).then(function successCallback(response) {
                            $(".pwd-box-remark input").val("");
                            if(response.data.code==0){
                                layer.msg("操作成功！");
                                $scope.returnData=response.data.data;
                                setTimeout(function () {
                                    window.location.href = '/index.php/Home/Virtualcurrency/xpay_orderlist?type='+$scope.returnData.type+"&currency="+$scope.returnData.currency+"&trans_type="+$scope.returnData.trans_type+"&status="+$scope.returnData.status;
                                }, 1000);
                            }else {
                                if(response.data.msg != '' && response.data.msg != null) {
                                    layer.msg(response.data.msg,{time:1500})
                                }
                            }
                        }, function errorCallback(response) {
                            errorHandle(response);
                        });
                    }
                });
            });
            //更改金额
            function  changeMoney(obj) {
                $("#money").text(obj*($("#price").text()));
            }
        </script>
    </block>
</block>